{extend name='index@template/base'}{/extend}
{block name='style'}
<link rel="stylesheet" href="__STATIC__/plugins/bootstrap-treeview/bootstrap-treeview.min.css">
<style>
    /*help tip*/

    .help-tip{
        position: absolute;
        top: 5px;
        text-align: center;
        background-color: #3C8DBC;
        border-radius: 50%;
        width: 20px;
        height: 20px;
        font-size: 14px;
        line-height: 20px;
        cursor: default;
    }

    .help-tip:before{
        content:'?';
        font-weight: bold;
        color:#fff;
    }

    .help-tip:hover p{
        display:block;
        transform-origin: 100% 0%;

        -webkit-animation: fadeIn 0.3s ease-in-out;
        animation: fadeIn 0.3s ease-in-out;

    }

    .help-tip p{
        display: none;
        text-align: left;
        background-color: #FFF;
        padding: 10px;
        width:150px;
        position: absolute;
        border-radius: 3px;
        box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.3);
        top:25px;
        left:-4px;
        color: #555;
        font-size: 13px;
        line-height: 1.4;
        z-index: 10000;
    }

    .help-tip p:before{
        position: absolute;
        content: '';
        width:0;
        height: 0;
        border: 6px solid transparent;
        border-bottom-color:#FFF;
        top:-10px;
        filter: drop-shadow(1px -3px 1px rgba(0, 0, 0, 0.3));
    }

    .help-tip p:after{
        width:100%;
        height:40px;
        content:'';
        position: absolute;
        top:-40px;
        left:0;
    }
</style>
{/block}
{block name='script'}
<script src="__STATIC__/plugins/bootstrap-treeview/bootstrap-treeview.min.js"></script>
{/block}
{block name='content'}
<div class="wrapper">
    <form class="form-horizontal" id="form" action="{:url('ShopGoodsCategory/update')}">
        <input type="hidden" name="id" value="{$item.id}">
        <div class="box-body">
            {eq name='$item.num' value='0' }
            <div class="form-group">
                <label class="col-sm-3 control-label"><i data-icomoon="&#xe05c"></i>对应商家</label>
                <div class="col-sm-6">
                    <select id="store" name='store_id' class="form-control select2" datatype="*" nullmsg="请选择对应商家">
                        {volist name="store['rows']" id="vo"}
                        <option value="{$vo.id}" {if is_array($item) && $item.store_id==$vo.id}selected{/if} >{$vo.text}</option>
                        {/volist}
                    </select>
                </div>
                <div class="col-sm-3"></div>
            </div>
            {else/}
            <div class="form-group">
                <label class="col-sm-3 control-label">对应商家</label>
                <div class="col-sm-6">
                    <input type="hidden" name="store_id" value="{$store['rows'][0]['id']}">
                    <input class="form-control" type="text" value="{$store['rows'][0]['text']}" readonly>
                </div>
                {if empty($sid)}

                <div class="col-sm-3">
                <div class="help-tip">
                    <p>如需修改对应商家，请先解除该分类下的所有商品关系。</p>
                </div>
                </div>
                {/if}
            </div>
            {/eq}

            <div class="form-group">
                <label class="col-sm-3 control-label">分类名称</label>
                <div class="col-sm-6">
                    <input class="form-control" type="text" name="name" value="{$item.name}">
                </div>
                <div class="col-sm-3"></div>
            </div>
            <input type="hidden" name="icon">
            <!--<div class="form-group">-->
                <!--<label class="col-sm-3 control-label">分类图标</label>-->
                <!--<div class="col-sm-6">-->
                    <!--<input class="form-control" type="text" name="icon" value="{$item.icon}">-->
                <!--</div>-->
                <!--<div class="col-sm-3"></div>-->
            <!--</div>-->
            <div class="form-group">
                <label class="col-sm-3 control-label">排序</label>
                <div class="col-sm-6">
                    <input class="form-control" type="text" name="sort" value="{$item.sort}">
                </div>
                <div class="col-sm-3"></div>
            </div>
            <div class="form-group">
                <label class="col-sm-3 control-label">是否使用</label>
                <div class="col-sm-6"  style="margin-top: 7px">
                    <span class="mr20" style="padding-right: 20px"><input type="radio" class="minimal" name="flag_use" value="1" {if $item.flag_use eq 1}checked{/if} > 启用</span>
                    <span class="mr20"><input type="radio" class="minimal" name="flag_use" value="0" {if $item.flag_use eq 0}checked{/if}> 禁用</span>
                </div>
                <div class="col-sm-3"></div>
            </div>
            <div class="form-group">
                <div class="col-sm-9 col-sm-offset-3">
                    <button type="submit" class="btn btn-primary">&nbsp;&nbsp;提交&nbsp;&nbsp;</button>
                    <button type="button" class="btn btn-default radius ml-20" onclick="layer_close();">&nbsp;&nbsp;取消&nbsp;&nbsp;</button>
                </div>
            </div>
        </div>
    </form>
</div>
{/block}
{block name='script_extra'}
<script>
    var tree_data_url="{:url('ShopGoodsCategory/cate_tree_data')}"
</script>
<script>
    $("#form").Validform({
        tiptype:2,
        showAllError:true,
        ajaxPost: true,
        callback: function (res) {
            if (res.success == true){
                layer.msg(res.message, {time: 1000},function () {
                    layer_close();
                    parent.location.reload();
                });
            }else{
                layer.alert(res.message);
            }
        }
    });
</script>
<script>
    function show_tree() {
        var treeview=$('.treeview');
        get_tree();
        if(treeview.is(":hidden")){
            treeview.show();
        }else{
            treeview.hide();
        }
    }
    function get_tree() {
        var treeview=$('.treeview');
        $.post(tree_data_url, function (json) {
            console.log(json);
            treeview.treeview({
                color:'#428bca',
                onNodeSelected: function(event, node) {
                    $('.tree-input').val(node.text);
                    $('#parent_id').val(node.id);
                    treeview.hide();
                },
                levels:1,
                data: json});
        });
    }
</script>
<script>


    var noticeN3Volume = 100;

    function setN3Volume(vol) {
        noticeN3Volume = vol;
        jQuery('.jBoxN3-volume').removeClass('active');
        jQuery('#jBoxN3-volume' + vol).addClass('active')
    }
    jQuery(document).ready(function() {
        new jBox('Tooltip', {
            id: 'jBoxT6',
            width: 280,
            closeOnMouseleave: true,
            animation: 'zoomIn',
            attach: jQuery('#demoT6'),
            content: 'I won"t close when you move your mouse over me'
        });
    });


</script>
{/block}